<template>
  <div class="workTicketProcessing flowCloumn h100">
    <div class="constentmain h100">
      <list-table-new v-bind="tableSetting" ref="klTable"></list-table-new>
    </div>
  </div>
</template>
<script>
import { getWorkTicketList } from "@/api/twoTicketManagement/workTicket.js";
export default {
  props: {
    selectId: {
      type: Array,
      default: () => {
        return [];
      },
    },
  },
  data() {
    return {
      checkData: [], //记录已选的数据
      tableSetting: {
        multipleSelect: false,
        radioShow: false,
        showFilterBtn: false, // 过滤器
        showCustomBtn: false, // 自定义列
        seleteData: {},
        highlightCurrentRow: true,
        showIndex: false,
        // 搜索框
        searchObj: {
          searchMethod: (params, sortStr) => {
            this.getTableData(params, sortStr);
          },
          queryData: {
            page: 1,
            pageSize: 15,
            statusList: ["5", "6", "7"],
          },
          searchArr: [
            {
              type: "select",
              label: "工作票类型",
              model: "type",
              option: this.$store.getters["dirtData"]("ticket_work_type"),
            },
            {
              type: "organization",
              label: "开票单位",
              model: "unitName",
              idsStr: "unit",
            },
            {
              type: "input",
              label: "标题",
              model: "title",
              placeholder: "请输入",
            },
            {
              type: "select",
              label: "状态",
              model: "statusList",
              multiple: true,
              collapseTags: true,
              option: this.$store.getters["dirtData"]("ticket_work_status"),
              disabledOption: false,
            },
            {
              type: "datetimerange",
              label: "计划起止时间",
              model: "estimatedTime",
            },
            {
              type: "location",
              label: "工作地点",
              model: "locationName",
              idsStr: "location",
            },
            {
              type: "input",
              label: "工作票票号",
              model: "code",
              placeholder: "请输入",
            },
            {
              type: "select",
              label: "是否外单位",
              model: "outsideUnit",
              option: this.$store.getters["dirtData"]("YesOrNo"),
            },
            {
              type: "organization",
              label: "工作班组",
              model: "team",
              placeholder: "请选择或输入",
            },
            {
              type: "userOnly",
              label: "工作负责人",
              model: "directorName",
              placeholder: "请选择或输入",
            },
            {
              type: "datetimerange",
              label: "填票时间",
              model: "createTime",
            },
          ],
        },
        tableDataObj: {
          tableArr: [],
          total: null,
        },
        // 过滤器的值
        filterFormData: {},
        // 过滤器的默认值
        defaultFilterData: {},
        userCustomData: [],
        // 表头
        column: [
          {
            label: "状态",
            prop: "statusList",

            formatter: (row) => {
              let types = this.$store.getters["dirtData"]("ticket_work_status");
              let val = row.status;
              let obj = types.find((i) => i.value == val);
              return obj ? obj.label : val;
            },
          },
          {
            label: "工作票类型",
            prop: "type",

            formatter: (row) => {
              let types = this.$store.getters["dirtData"]("ticket_work_type");
              let val = row.type;
              let obj = types.find((i) => i.value == val);
              return obj ? obj.label : val;
            },
          },
          {
            label: "工作票票号",
            prop: "code",
          },
          {
            label: "标题",
            prop: "title",

            width: 140,
          },
          {
            label: "开票单位",
            prop: "unitName",
          },
          {
            label: "工作负责人",
            prop: "directorName",
          },
          {
            label: "工作班组",
            prop: "team",
          },

          {
            label: "工作地点",
            prop: "locationName",
          },

          {
            label: "计划开始时间",
            prop: "estimatedStartTime",

            width: 140,
          },
          {
            label: "计划结束时间",
            prop: "estimatedEndTime",

            width: 140,
          },
          {
            label: "当前环节",
            prop: "curNodeName",
          },
          {
            label: "当前处理人",
            prop: "curNodeUserName",
            showTooltip: true,
          },
        ],
        // 表格方法
        tableMethods: {
          //点击行的方法
          rowClick: (val) => {
            let hasData = false;
            let index = -1;
            this.seleteData = val;
            this.multipleSelect && this.$refs.klTable.toggleRowSelection(val);
            !this.multipleSelect && this.$refs.klTable.radioSelect(val);
            const curPageData = this.$refs.klTable.getSelectData();
            //删除取消勾的数据
            for (let i = 0; i < this.checkData.length; i++) {
              if (this.checkData[i].id === val.id) {
                hasData = true;
                index = i;
              }
            }
            hasData && this.checkData.splice(index, 1);
            //保存勾选的数据
            for (let n = 0; n < curPageData.length; n++) {
              const obj = curPageData[n];
              let save = true;
              for (let i = 0; i < this.checkData.length; i++) {
                obj.id === this.checkData[i].id && (save = false);
              }
              save && this.checkData.push(obj);
            }
          },
        },
      },
    };
  },
  created() {
    let query = {
      statusList: ["5", "6", "7"],
      // unit:
      //   this.$store.state.user.userInfo.orgId ||
      //   this.$store.state.user.userInfo.deptId,
      // unitName:
      //   this.$store.state.user.userInfo.orgName ||
      //   this.$store.state.user.userInfo.deptName,
    };
    this.tableSetting.searchObj.queryData = Object.assign(
      this.tableSetting.searchObj.queryData,
      query
    );
    //设置部分状态可选
    this.tableSetting.searchObj.searchArr[3].option.forEach((o) => {
      query.statusList.includes(o.value)
        ? (o.disabledOption = false)
        : (o.disabledOption = true);
    });
  },
  mounted() {
    this.init();
  },
  methods: {
    init() {
      this.$refs.klTable.searchData();
    },
    // 查询表格数据
    async getTableData(params, sortStr) {
      let queryData = Object.assign({}, params);
      if (sortStr.length > 0) {
        queryData.orders = sortStr;
      }
      if (queryData.estimatedTime) {
        queryData.estimatedStartTime = queryData.estimatedTime[0];
        queryData.estimatedEndTime = queryData.estimatedTime[1];
        delete queryData.estimatedTime;
      }
      if (queryData.createTime) {
        queryData.startCreateTime = queryData.createTime[0];
        queryData.endCreateTime = queryData.createTime[1];
        delete queryData.createTime;
      }
      getWorkTicketList(queryData)
        .then((list) => {
          this.$set(this.tableSetting, "tableData", list.data.list);
          this.$set(this.tableSetting, "totalNumber", list.data.total);
          let data = list.data.list || [];
          /* 回显选中的数据 */
          list.data.list?.forEach((obj) => {
            this.selectId.includes(obj.id) && this.checkData.push(obj);
          });
          this.checkedOrder();
        })
        .catch((e) => {
          this.$set(this.tableSetting, "tableData", []);
          this.$set(this.tableSetting, "totalNumber", 0);
        });
    },
    // 勾选已选中的工作票
    checkedOrder() {
      this.checkData.forEach((row) => {
        this.multipleSelect && this.$refs.klTable.selectioned(row);
        !this.multipleSelect && this.$refs.klTable.radioSelect(row);
      });
    },

    // 返回选中数据
    getSeleteData() {
      const { selectionShow } = this.tableSetting;
      if (selectionShow) {
        const codeArr = [];
        const idArr = [];
        this.$refs.klTable.getSelectData().forEach((item) => {
          item.code !== null && codeArr.push(item.code);
          idArr.push(item.id);
        });
        this.seleteData = { id: idArr, code: codeArr.toString() };
      } else {
        this.seleteData = this.$refs.klTable.getRadioData();
      }
      return this.seleteData;
    },
    //设置多选
    setCheckbox() {
      this.multipleSelect = true;
      this.$set(this.tableSetting, "selectionShow", true);
    },
    //设置单选
    setRadio() {
      this.multipleSelect = false;
      this.$set(this.tableSetting, "radioShow", true);
    },
  },
};
</script>
<style lang="less" scoped>
.workTicketProcessing {
  .constentmain {
    margin-left: 10px;
  }
}
.flowCloumn {
  display: flex;
  flex-flow: column nowrap;
}
</style>